
window.addEventListener('load', function () {


    //头部登录前
    loginShow();
    function loginShow() {
        var userinfo = document.querySelector('.Userinfo');
        var userinfoU2 = document.querySelector('.Userinfo-u2');
        var userinfoU1 = document.querySelector('.Userinfo-u1');
        userinfo.onmouseover = function () {
            userinfoU1.style.display = 'none'
            userinfoU2.style.transform = 'translateY(74px)';
        }
        userinfo.onmouseout = function () {
            userinfoU1.style.display = 'flex'
            userinfoU2.style.transform = 'translateY(-100%)';

        }
    }
    //头部登录后
    logined();
    function logined() {
        var userinfo = document.querySelector('.userLoginfo');
        var userinfoU2 = document.querySelector('.userLoginfo-u2');
        var userinfoU1 = document.querySelector('.userLoginfo-u1');
        userinfo.onmouseover = function () {
            userinfoU1.style.display = 'none'
            userinfoU2.style.transform = 'translateY(74px)';
        }
        userinfo.onmouseout = function () {
            userinfoU1.style.display = 'flex'
            userinfoU2.style.transform = 'translateY(-100%)';
        }
    }

    //头部导航
    navColor()
    function navColor() {
        var navList = document.querySelectorAll('.hearderNav li');
        for (var i = 0; i < navList.length; i++) {
            navList[i].onclick = function () {
                for (var j = 0; j < navList.length; j++) {
                    navList[j].style.color = '#898587'
                }
                this.style.color = '#024137'
                // console.log(this);
            }
        }

    }

    //头部搜索
    search()
    function search() {
        var searchShow = document.querySelector('.searchBar');
        var search = document.querySelector('.searchInput');
        search.onfocus = function () {
            searchShow.classList.add('show');
        }
        search.onblur = function () {
            searchShow.classList.remove('show');
        }


    }

    //返回顶部
    backTop();
    function backTop() {
        var back = document.querySelector('.cor-top');
        window.addEventListener('scroll', function () {
            var topH = document.documentElement.scrollTop;
            if (topH >= 200) {
                back.style.display = 'block';
            } else {
                back.style.display = 'none';
            }
        })
        back.onclick = function () {
            window.scrollTo({
                top: 0,
                left: 0,
                behavior: "smooth"
            });
        }
    }

    //登录切换
    navTab('.bq-tabBox li', '.loginItem')
    /**
    * tab切换
    * @param {*} liS  导航中所有的li 
    * @param {*} itemS 所有的模块
    */
    function navTab(liS, itemS) {
        //获取导航中所有的li
        var leftNav = document.querySelectorAll(liS);

        //获取所有的模块
        var items = document.querySelectorAll(itemS);
        // console.log(items);

        //循环li让选中的展示
        for (var i = 0; i < leftNav.length; i++) {
            leftNav[i].onclick = function () {

                for (var j = 0; j < items.length; j++) {
                    leftNav[j].classList.remove('active');
                    items[j].classList.remove('show');
                }
                var itemShow = document.querySelector(`.${this.dataset.name}`);
                itemShow.classList.add('show');
                this.classList.add('active');
            }
        }
    }



    //弹窗
    pop();
    function pop() {
        var loginButton = document.querySelector('.Userinfo-u2-login');
        var registButton = document.querySelector('.Userinfo-u2-regist');
        var loginBox = document.querySelector('.bp-widget-zzc');
        var registBox = document.querySelector('.rg-widget-zzc');
        var html = document.querySelector('html');
        loginButton.onclick = function () {
            html.style.overflow = 'hidden';
            loginBox.style.display = 'block';
        }
        registButton.onclick = function () {
            html.style.overflow = 'hidden';
            registBox.style.display = 'block';
        }
        //关闭弹窗
        var closeb = document.querySelector('.bp-widget-zzc .close');
        //  console.log(closeb);
        closeb.onclick = function () {
            html.style.overflow = 'scroll';
            loginBox.style.display = 'none';
        }
        // 关闭弹窗
        var closeq = document.querySelector('.rg-widget-zzc .close');
        closeq.onclick = function () {
            html.style.overflow = 'scroll';
            registBox.style.display = 'none';
        }
    }




    //验证码
    code();
    function code() {
        var box = document.querySelector('.ins-captcha');
        var textS = document.querySelectorAll('.ins-captcha span');
        // 1. 随机背景颜色
        box.style.backgroundColor = rand(150, 255);
        // 3. 随机产生文本
        for (var i = 0; i < textS.length; i++) {
            textS[i].innerHTML = String.fromCharCode(randNum(97, 122));
            textS[i].style.color = rand(0, 100);
            textS[i].style.transform = `rotate(${randNum(-45, 45)}deg)`;
        }
        function rand(min, max) {
            var rand1 = Math.floor(Math.random() * (max - min + 1) + min);
            var rand2 = Math.floor(Math.random() * (max - min + 1) + min);
            var rand3 = Math.floor(Math.random() * (max - min + 1) + min);
            return `rgb(${rand1},${rand2},${rand3})`;
        }

        function randNum(min, max) {
            var rand1 = Math.floor(Math.random() * (max - min + 1) + min);
            return rand1;
        }

    }

    //密码登录验证
    passLogin();
    function passLogin() {
        var count = document.querySelector('.passLogin .ins-auth__input');
        var password = document.querySelector('.password');
        var btn = document.querySelector('.passLogin .confirm');
        btn.onclick = function () {
            console.log(password.vaule);
            console.log(count.vaule);
            if (count.value == '' || password.value == '') {
                alert('账号密码不能为空');
            } else {
                if (window.XMLHttpRequest) {
                    var xhr = new XMLHttpRequest();
                }
                xhr.open('get', ' http://localhost:3000/user', false);
                xhr.send();
                if (xhr.status == 200 && xhr.readyState == 4) {
                    var data = JSON.parse(xhr.responseText);
                    var flag = false;
                    for (var i in data) {
                        if (count.value == data[i].iphone) {
                            flag = true;
                            if (password.value == data[i].password) {
                                alert('登陆成功');
                                window.location.reload();
                                localStorage.setItem('uid', data[i].id);
                            } else {
                                alert('密码错误');
                                password.value = '';
                            }
                        }
                    }
                    if (flag == false) {
                        alert('用户不存在');
                        count.value = '';
                    }
                }
            }
        }
    }

    //短信登录验证
    messLogin();
    function messLogin() {
        var count = document.querySelector('.messLogin .ins-auth__input');
        var codeInp = document.querySelector('.is-captcha');
        var codeBox = document.querySelector('.ins-captcha');
        var changeBtn = document.querySelector('.ins-captchaTip'); getCode
        var loginBtn = document.querySelector('.messLogin .confirm');
        var getCode = document.querySelector('.getCode');
        codeBox.onclick = function () {
            code();
        }
        changeBtn.onclick = function () {
            code();
        }
        count.onblur = function () {
            if (count.value == '') {
                alert('手机号不能为空');
            }
        }
        loginBtn.onclick = function () {
            if (count.value == '' || codeInp.value == '') {
                alert('手机号或验证码不能为空');
            } else {
                var codeText = '';
                var textS = document.querySelectorAll('.ins-captcha span');
                for (var i = 0; i < textS.length; i++) {
                    codeText += textS[i].innerHTML;
                }
                if (codeInp.value != codeText) {
                    alert('验证码输入错误');
                } else {
                    alert('登陆成功');
                }
            }

        }
        var myTimer = null;
        getCode.onclick = function () {
            console.log(111);
            var num = 5;
            var _this = this;
            clearInterval(myTimer)
            myTimer = setInterval(function () {
                if (num <= 0) {
                    clearInterval(myTimer);
                    _this.innerText = '获取验证码'
                    _this.style.color = '#000'
                } else {
                    num--;
                    _this.innerText = num + 's'
                    _this.style.color = '#ccc'
                }
            }, 1000)
        }

    }

    //判断用户是否登录
    isLogin();
    function isLogin() {
        var uid = localStorage.getItem('uid');
        // 登录前
        var loginBefore = document.querySelector('.Userinfo');
        // 登录后
        var loginAfter = document.querySelector('.userLoginfo');
        var unameShowS = document.querySelector('.userLoginfo-u1-login');
        var unameShowB = document.querySelector('.userLoginfo-u2-login');
        // console.log(uid);
        if (uid == null) {
            loginBefore.style.display = 'block';
            loginAfter.style.display = 'none';
            unameShowS.innerHTML = '';
            unameShowB.innerHTML = '';
        } else {
            loginBefore.style.display = 'none';
            loginAfter.style.display = 'block';
            if (window.XMLHttpRequest) {
                var xhr = new XMLHttpRequest();
            }
            xhr.open('get', ' http://localhost:3000/user?id=' + uid, false);
            xhr.send();
            if (xhr.status == 200 && xhr.readyState == 4) {
                var data = JSON.parse(xhr.responseText);
                unameShowS.innerHTML = data[0].name;
                unameShowB.innerHTML = data[0].name;
                // console.log(data);
            }
        }
    }

    //进入详情页
    goInfo();
    function goInfo(){
        var loginIn=document.querySelector('.userLoginfo-u2-login');
        loginIn.onclick=function(){
            window.open('userInfo.html','_self');
        }
    }

})